<?xml version="1.0" encoding="UTF-8" ?>
<%@page import="hangman.HangmanGame"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
	
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<title>Insert title here</title>
	<%@ include file="layout/head_includes.jsp" %>
</head>

<body>

	<div id="main-container">
					
		<div id="content">
			
			<% hangman.HangmanGame game = ((hangman.HangmanGame)request.getSession().getAttribute("game")); %>
			<%= game.start() %>
			
			<div id="hangman_container">
			
				<div id="hangman_picture">
				
					<img src="img/hangman_images/Hangman-<%= game.getTurn() %>.png" />	
				</div>
				
				<div>
					Word:
					<ul class="hangman-guess-list">
						<% for( Character c : game.getGuessedWord() ){%>
							<li>
								<%= c %>
							</li>
						<% }%>
					</ul>
				</div>
				<div class="clear"></div>
				<div>
					Misses:
					<ul class="hangman-selected-list">
						<% for( Character c : game.getCharactersSelected() ){%>
							<li>
								<%= c %>
							</li>
						<% }%>
					</ul>
				</div>
				<div class="clear"></div>
				<div>
					Pick a letter:
					<ul class="hangman-chars-left">
						<% for( Character c : game.getCharactersLeft() ){%>
							<li>
								<input type="button" class="input-button" value="<%= c %>" />
							</li>
						<% }%>
					</ul>
				</div>				
			</div>
			
			<div class="clear"></div>
			
			<% if( ! game.isOver() ){ %>
				<div id="hangman_form">
				
					<form id="form-hangman" method="post" action="hangman">
											
						<input type="hidden" id="text" name="text" value="" />
						<input type="submit" value="Guess" />
					</form>
									
				</div>
			<% }else{ %>
				<div id="hangman_status">
					<%= game.getStatus() %>
				</div>			
			<% }%>
		</div>
		
	</div>
	
</body>
</html>